<?php
if (post_password_required()) {
    return;
}
?>

<div id="comments" class="bg-white rounded-lg shadow p-6">
    <?php if (have_comments()) : ?>
        <h2 class="text-lg font-medium mb-4">
            <?php
            printf(
                _nx(
                    '%1$s 条评论',
                    '%1$s 条评论',
                    get_comments_number(),
                    'comments title',
                    'reddit-clone'
                ),
                number_format_i18n(get_comments_number())
            );
            ?>
        </h2>

        <!-- 评论排序 -->
        <div class="flex items-center gap-2 mb-6 text-sm">
            <span class="text-gray-500">排序方式:</span>
            <button class="text-blue-600 hover:bg-blue-50 px-2 py-1 rounded">最佳</button>
            <button class="text-gray-600 hover:bg-gray-50 px-2 py-1 rounded">最新</button>
            <button class="text-gray-600 hover:bg-gray-50 px-2 py-1 rounded">有争议</button>
        </div>

        <!-- 评论列表 -->
        <div class="space-y-6">
            <?php
            wp_list_comments(array(
                'style' => 'div',
                'callback' => function($comment, $args, $depth) {
                    ?>
                    <div id="comment-<?php comment_ID(); ?>" class="<?php echo $depth > 1 ? 'ml-8' : ''; ?>">
                        <div class="flex gap-3">
                            <!-- 投票区 -->
                            <div class="flex flex-col items-center">
                                <button class="p-1 hover:bg-gray-100 rounded text-gray-400">
                                    <svg class="w-4 h-4" fill="currentColor" viewBox="0 0 20 20">
                                        <path d="M10 12.5l-5-5h10l-5 5z"/>
                                    </svg>
                                </button>
                                <span class="text-xs my-0.5">0</span>
                                <button class="p-1 hover:bg-gray-100 rounded text-gray-400">
                                    <svg class="w-4 h-4" fill="currentColor" viewBox="0 0 20 20">
                                        <path d="M10 7.5l5 5H5l5-5z"/>
                                    </svg>
                                </button>
                            </div>

                            <!-- 评论内容 -->
                            <div class="flex-1">
                                <!-- 评论元信息 -->
                                <div class="flex items-center gap-2 text-xs text-gray-500 mb-1">
                                    <a href="<?php echo get_comment_author_url(); ?>" class="font-medium text-gray-900 hover:underline">
                                        <?php echo get_comment_author(); ?>
                                    </a>
                                    <span>•</span>
                                    <span><?php echo human_time_diff(get_comment_time('U'), current_time('timestamp')); ?> ago</span>
                                </div>

                                <!-- 评论文本 -->
                                <div class="text-sm text-gray-800 mb-2">
                                    <?php comment_text(); ?>
                                </div>

                                <!-- 评论操作 -->
                                <div class="flex items-center gap-4 text-xs text-gray-500">
                                    <?php
                                    comment_reply_link(array_merge($args, array(
                                        'depth' => $depth,
                                        'max_depth' => $args['max_depth'],
                                        'before' => '<span class="hover:bg-gray-100 px-2 py-1 rounded cursor-pointer">',
                                        'after' => '</span>'
                                    )));
                                    ?>
                                    <span class="hover:bg-gray-100 px-2 py-1 rounded cursor-pointer">Share</span>
                                    <span class="hover:bg-gray-100 px-2 py-1 rounded cursor-pointer">Report</span>
                                    <span class="hover:bg-gray-100 px-2 py-1 rounded cursor-pointer">Save</span>
                                </div>
                            </div>
                        </div>
                    </div>
                    <?php
                }
            ));
            ?>
        </div>

        <?php if (get_comment_pages_count() > 1 && get_option('page_comments')) : ?>
            <nav class="flex justify-center gap-2 mt-6">
                <?php
                paginate_comments_links(array(
                    'prev_text' => __('上一页'),
                    'next_text' => __('下一页'),
                    'type' => 'array'
                ));
                ?>
            </nav>
        <?php endif; ?>
    <?php endif; ?>

    <?php if (comments_open()) : ?>
        <!-- 评论表单 -->
        <?php
        comment_form(array(
            'title_reply' => '',
            'comment_field' => sprintf(
                '<div class="mb-4"><textarea id="comment" name="comment" class="w-full px-4 py-2 text-sm border border-gray-200 rounded-lg focus:outline-none focus:ring-2 focus:ring-blue-500 focus:border-transparent" rows="4" placeholder="%s"></textarea></div>',
                __('写下你的评论...', 'reddit-clone')
            ),
            'class_submit' => 'px-4 py-2 bg-blue-600 text-white text-sm font-medium rounded-lg hover:bg-blue-700',
            'submit_button' => '<button type="submit" class="%s">%s</button>'
        ));
        ?>
    <?php endif; ?>
</div> 